<template>
  <div>
    <!-- 更新DOM对象的innerHTML,html标签会生效 -->
    <!-- <h6 v-html="str"></h6> -->
    <h6>{{ str }}</h6>
    <!-- <button v-on:click="btnClick">翻转</button> -->
    <button @click="btnClick">翻转</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      str: '月落乌啼霜满天，江枫渔火对愁眠。姑苏城外寒山寺，夜半钟声到客船',
    }
  },
  methods: {
    btnClick() {
      // split('') 转成数组 reverse()数组翻转 join('')转成字符串
      this.str = this.str.split('').reverse().join('')
    },
  },
}
</script>

<style></style>
